﻿<div id="status" ng-show="pageLoading"></div>
<div class="all-elements">
    <div id="content" class="page-content">
        <form name="myForm">
            <div class="page-content-wrapper">
                <div id="createUserstatus"></div>
                <div class="page-content-wrapper">
                    <div id="lesson-content">
                        <label for="email">Địa chỉ email (*)</label>
                        <input type="email" id="email" name="email" ng-model="formData.Email" required ng-blur="checkEmailOnblur()" ng-focus="checkEmailFocus()">
                        <span ng-show="!myForm.email.$error.required && myForm.email.$error.email && myForm.email.$dirty">Vui lòng nhập một địa chỉ email</span>
                        <span ng-show="!checkEmail">Địa chỉ email đã được sử dụng</span>
                        <br />
                        <label for="email">Số điện thoại</label>
                        <input type="number" id="phoneNumber" name="phoneNumber" ng-model="formData.PhoneNumber" ng-minlength="9" ng-maxlength="15" ng-pattern="/^[0-9]*$/">
                        <span ng-show="(myForm.phoneNumber.$error.minlength || myForm.phoneNumber.$error.maxlength) && myForm.phoneNumber.$dirty">Số điện thoại phải từ 9-> 15 ký tự</span>
                        <br />
                        <label for="email">Tên đầy đủ (*)</label>
                        <input type="text" id="name" name="name" ng-model="formData.FullName" required />
                        <span ng-show="myForm.name.$error.required && myForm.name.$dirty">Trường bắt buộc</span>
                        <br />
                        <label for="username">Tên tài khoản(dùng đăng nhập) (*)</label>
                        <input type="text" id="username" name="username" ng-model="formData.UserName" ng-minlength="5" ng-maxlength="20" ng-pattern="/^[A-z][A-z0-9]*$/" required ng-blur="checkUserOnblur()" ng-focus="checkUserFocus()" />
                        <span ng-show="myForm.username.$error.required && myForm.username.$dirty">Trường bắt buộc</span>
                        <span ng-show="!myForm.username.$error.minLength && !myForm.username.$error.maxLength && myForm.username.$error.pattern && myForm.username.$dirty">Tài khoản bắt đầu bằng chữ, chỉ được phép dùng chữ và số.</span>
                        <span ng-show="!myForm.username.$error.required && (myForm.username.$error.minlength || myForm.username.$error.maxlength) && myForm.username.$dirty">Tài khoản phải lớn hơn 5 và nhỏ hơn 20 ký tự.</span>
                        <span ng-show="!checkUser">Tài khoản này đã được sử dụng</span>
                        <br />


                        <label for="password">Mật khẩu (*)</label>
                        <input type="password" id="password" name="password" ng-model="formData.Password" ng-minlength="8" ng-maxlength="20" required />
                        <span ng-show="myForm.password.$error.required && myForm.password.$dirty">Trường bắt buộc</span>
                        <span ng-show="!myForm.password.$error.required && (myForm.password.$error.minlength || myForm.password.$error.maxlength) && myForm.password.$dirty">Password phải từ 8 đến 20 ký tự</span>
                        <br />


                        <label for="password_c">Nhập lại mật khẩu (*)</label>
                        <input type="password" id="password_c" name="password_c" required ng-model="formData.PasswordC" valid-password-c />
                        <span ng-show="myForm.password_c.$error.required && myForm.password_c.$dirty">Trường bắt buộc</span>
                        <span ng-show="!myForm.password_c.$error.required && myForm.password_c.$error.noMatch && myForm.password.$dirty">Mật khẩu không trùng khớp.</span>
                        <br />
                        <div ng-show="errorStatus" class="error">Xảy ra lỗi!</div>
                        <div ng-show="successStatus" class="success">Tạo thành công! vui long đăng nhập mail để xác nhận thống tin.</div>
                    </div>
                </div>
            </div>
            <div class="footer">
                <div class="footer-shortcuts">
                    <div>
                        <a href="#/">
                            <span class="button-bottom icon-back-room"></span><span class="button-text">Quay về</span>
                        </a>
                    </div>
                    <div><span class="button-bottom icon-next-lesson"></span><button type="submit" class="btn" ng-disabled="!myForm.$valid" ng-click="createUser()">Tạo tài khoản</button></div>
                </div>
            </div>
        </form>
    </div>
</div>
